<template>
  <div class="di">
    <header>
      <span @click="handleHui">&lt;</span>
      <p>地图</p>
      <span></span>
    </header>
    <main>
      <div id="container"></div>
    </main>
  </div>
</template>

<script>
export default {
  mounted() {
    let { BMapGL } = window;
    var map = new BMapGL.Map("container");
    map.centerAndZoom("郑州", 19);
    map.enableScrollWheelZoom(true); // 开启鼠标滚轮缩放
  },
  methods:{
      handleHui(){
          this.$router.go(-1);
      }
  }
};
</script>

<style lang="scss" scoped>
.di {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  main {
    flex: 1;
  }
  header {
    width: 100%;
    height: 50px;
    padding: 10px;
    display: flex;
   justify-content: space-between;
    align-items: center;
    background: #ccc;
    span {
        font-size: 20px;
    }
    p{
        font-size: 16px;
    }
  }
  #container {
    overflow: hidden;
    width: 100%;
    height: 100%;
    margin: 0;
    font-family: "微软雅黑";
  }
}
</style>